Vue.component('v-ppt', {
    props: {
        element:Object,
        mode:String,
    },
    data: function () { 
        return {
            currentEle:null,
        }
    },
    computed:{
        content:function(){
            return this.currentEle?localStorage.getItem(this.currentEle.id+"C"):'';
        }
    },
    mounted: function () {
        this.currentEle = [].concat(this.element).sort(function(a,b){
            return a.id - b.id;
        })[0];
        console.log(this.currentEle)
    },
    methods: {
        getRlTitle:function(dir){
            if(!this.currentEle){
                return '';
            }
            else{
                var hsT = localStorage.getItem(this.currentEle.bindmap[dir-1][0]+"T");                
                return hsT||'暂无标题';
            }
        },
        gotoRlEle:function(dir){
            this.currentEle = this.element.filter(function(it){
                return it.id == this.currentEle.bindmap[dir-1][0];
            }.bind(this))[0]
        },
        showTitle:function(dir){
            if(this.currentEle){
                return this.currentEle.bindmap[dir-1][0]>0;
            }
            return false;
        }
    },
    template:'<div class="pptWrap" v-if="mode==\'ppt\'">\
    <p class="center"><span v-show="showTitle(1)" class="tit tit1" @click="gotoRlEle(1)" v-text="getRlTitle(1)"></span></p>\
    <div class="html" v-html="content"></div>\
    <p class="center"><span v-show="showTitle(3)" class="tit tit3" @click="gotoRlEle(3)" v-text="getRlTitle(3)"></span></p>\
    <span v-show="showTitle(2)" class="tit tit2" @click="gotoRlEle(2)" v-text="getRlTitle(2)"></span>\
    <span v-show="showTitle(4)" class="tit tit4" @click="gotoRlEle(4)" v-text="getRlTitle(4)"></span>\
            </div>'
})